<template>
    <Modal v-model:visible="isShowModal" title="状态审核" @ok="handleOk" @cancel="handleCancel" ok-text="提交"
        cancel-text="取消" :loading="loading">
        <Form ref="formRef" :label-col="{ span: 4 }" :wrapper-col="{ span: 18 }">
            <FormItem label="审核状态">
                <Select v-model:value="formState" placeholder="请选择状态" allowClear>
                    <Option v-for="item in stateOption" :value="item.value" :key="item.value">{{ item.label }} </Option>
                </Select>
            </FormItem>
        </Form>
    </Modal>
</template>

<script lang="ts" setup>
import { Modal, Form, message, Select } from 'ant-design-vue';
import { CompanyApi, EnumCompanyState, CompanyQueryResult } from '@/api';
import { convertEnumToOptions } from '@/utils/queryConversion';

const FormItem = Form.Item;
const Option = Select.Option;

const emit = defineEmits(['ok']);

const isShowModal = ref(false)
const loading = ref(false)
const editId = ref<string>();
const formState = ref(0)

const stateOption = convertEnumToOptions(EnumCompanyState)
const handleOpen = (data: CompanyQueryResult) => {
    handleEmpty();
    if (data) {
        editId.value = data.id?.toString();
        formState.value = data.state!;
    } else {
        handleEmpty();
    }
    isShowModal.value = true;
}

const handleOk = async () => {
    loading.value = true;
    try {
        await CompanyApi.companyCompanystateupdate(editId.value!, formState.value.toString())
        message.success('修改成功')
        emit('ok')
        handleClose();
    } catch (error) { } finally {
        loading.value = false;
    }
}

const handleEmpty = () => {
    editId.value = undefined;
    formState.value = 0;
}

function handleClose() {
    isShowModal.value = false;
}

function handleCancel() {
    handleEmpty();
    handleClose();
}

defineExpose({ handleOpen })
</script>